<!--
* @description 
* @fileName need.vue
* @author huangyu
* @date 2023/03/07 15:52:13
!-->
<template>
    <div class="app-container">
        <van-nav-bar title="采购需求大厅" />
        <!-- 管理员管理 -->
        <van-icon name="setting-o" size="20" v-if="powerRoleAdmin||powerRoleGM" style="position:fixed;right:10px;bottom:80px;z-index:10;" @click="isPoserShow=!isPoserShow" />
        <!-- 发布 -->
        <van-icon name="add" size="40" class="color_blue" v-if="token" style="position:fixed;right:10px;bottom:120px;z-index:10;" @click="alickAddNeed" />
        <van-pull-refresh v-model="isLoading">
            <van-cell-group>
                <van-cell v-for="(item,index) in needList" :key="index">
                    <template #title>
                        <van-tag type="danger" plain  size="mini" v-if="item.topNumber>0">置顶</van-tag>
                        <van-tag type="warning" plain  size="mini" v-if="item.zanNumber>15">热门</van-tag>
                        <span :class="item.topNumber>0?'color_blue':''">{{item.contant}}</span>
                    </template>
                    <template #right-icon>
                        <div class="color_blue" v-if="item.type==1">需求</div>
                        <div class="color_warning" v-if="item.type==2">福利</div>
                        <div class="color_danger" v-if="item.type==3">官方</div>
                    </template>
                    <template #label>
                        {{item.userModel.gameName}} {{item.createTimeStr}}
                        <span class="color_blue" v-if="!item.isZan"><van-icon name="good-job-o" style="font-size:14px;" @click="clickUpdate(item,'zan')" />{{item.zanNumber}}</span>
                        <span class="color_blue" v-else>已赞{{item.zanNumber}}</span>
                        <div v-if="isPoserShow">
                            <el-tag type="warning" size="mini" plain @click="clickUpdate(item,'top')">置顶{{item.topNumber}}</el-tag>
                            <el-tag type="warning" size="mini" plain @click="clickClearTop(item._id)" v-if="item.topNumber>0">取消置顶</el-tag>
                            <el-tag type="danger" size="mini" plain @click="clickUpdate(item,'del')">删除</el-tag>
                        </div>
                    </template>
                </van-cell>
            </van-cell-group>
        </van-pull-refresh>
        <van-pagination v-if="total>20" v-model="pageindex" :total-items="total" :items-per-page="pagesize" @change="changePage" />

        <van-dialog v-model="dialogNeed" title="发布内容" :showConfirmButton="false" :closeOnClickOverlay="true">
            <van-form @submit="onSubmitNeed" label-width="4em">
            <van-field name="radio" label="类型">
                <template #input>
                    <van-radio-group v-model="needForm.type" direction="horizontal">
                    <van-radio :name="1">需求</van-radio>
                    <van-radio :name="2">福利</van-radio>
                    <van-radio :name="3" v-if="powerRoleGM">官方</van-radio>
                    </van-radio-group>
                </template>
            </van-field>
            <van-field
                v-model="needForm.contant"
                rows="1"
                :autosize="{minHeight:50}"
                label="内容"
                type="textarea"
                placeholder="请输入内容"
            />
            <div style="margin: 16px;">
                <van-button round block type="info" native-type="submit">立即发布</van-button>
            </div>
            </van-form>
        </van-dialog>
    </div>
</template>

<script>
import { get } from '@/common/app.js'
import { formatDate } from '@/common/unit.js'
import { Toast } from 'vant';
export default {
    components: {},
    data() {
        return {
            token: this.$store.state.token,
            isLoading: false,
            needList: [],
            pageindex: 1,
            pagesize: 20,
            total: 0,
            isPoserShow: false,
            powerRoleAdmin: this.$power.roleAction('管理员'),
            powerRoleGM: this.$power.roleAction('GM'),

            dialogNeed: false,
            needForm: {
                contant: "",
                type: 1,
                userId: this.$store.state.token,
                topNumber: 0,
                hotNumber: 0,
                zanNumber: 0,
                status: 1,
            },
        }
    },
    mounted() {
        this.getData()
    },
    methods: {
        onSubmitNeed(){
            if(!this.needForm.contant){
                Toast("内容不能为空！")
                return
            }
            let params = {
                type: 'getNeed',
                api: 'api-need-add',
                data: this.needForm,
            }
            get('game', params).then(res => {
                if (res) {
                    this.$message.success("发布成功")
                    this.getData()
                    this.dialogNeed = false
                }
            })
        },
        alickAddNeed(){
            this.dialogNeed = true
        },
        clickClearTop(_id){
            let params = {
                type: 'getNeed',
                api: 'api-need-update-clear-top',
                token: this.token,
                data: {
                    _id: _id,
                },
            }
            get('game', params).then(res => {
                if (res) {
                    Toast("操作成功")
                    this.getData()
                }
            })
        },
        clickUpdate(row,value){
            if(!this.token){
                Toast("未登录，不能操作！")
                return;
            }
            let params = {
                type: 'getNeed',
                api: 'api-need-update',
                token: this.token,
                data: {
                    type: value,
                    _id: row._id,
                    topNumber: 1,
                    zanNumber: 1,
                    status: -1,
                },
            }
            get('game', params).then(res => {
                if (res) {
                    Toast("操作成功！")
                    this.getData()
                }
            })
        },
        
        changePage(value){
            this.pageIndex = value
            this.getData()
        },
        getData(){
            let params = {
                type: 'getNeed',
                api: 'api-need-list',
                token: this.token,
                data: {
                    pageIndex: this.pageindex,
                    pageSize: this.pagesize,
                },
            }
            get('game', params).then(res => {
                if (res) {
                    this.needList = res.list
                    this.needList.forEach(item=>{
                        item.userModel = item.userList?item.userList[0]:{}
                        item.createTimeStr = formatDate(new Date(item.createTime),'yyyy-MM-dd hh:mm:ss')
                    })
                    this.total = res.total
                }
            })
        },
        
    },
}
</script>

<style scoped></style>